<template>
  <div>
    <el-table
    :data="tableData3"
    stripe
    style="width: 100%">
    <el-table-column
    prop="transactionId"
    label="序号">
  </el-table-column>

  <el-table-column
  prop="transactionReasonRequest"
  label="申请类型">

</el-table-column>
<el-table-column
prop="transactionApplyDate"
label="申请日期" :formatter = "dateFormat" >

</el-table-column>
<el-table-column
prop="transactionResponseState"
label="审核状态">

</el-table-column>
<el-table-column
prop="transactionCurrentState"
label="现状">

</el-table-column>
<el-table-column
prop="transactionStartDate"
label="批准日期" :formatter = "dateFormat" >

</el-table-column>
</el-table>
<div class="block">
  <el-pagination
  @size-change="handleSizeChange"
  @current-change="handleCurrentChange"
  :current-page.sync="pageIndex"
  :page-size="pageSize"
  layout="prev, pager, next, jumper"
  :total="total">
</el-pagination>
</div>
</div>
</template>

<script>
//导入api接口
import { queryTransaction } from '@/axios/api'
import { formatDate } from '@/common/js/date'
export default {
  data() {
    return {
      pageIndex:1,
      total:0,
      pageSize:10,
      tableData3: []
    };
  },
  methods: {
    //时间格式化
    dateFormat:(row, column) => {
      let date = row[column.property];
      if (date == undefined) {
        return "";
      }
      return formatDate(new Date(date),'yyyy-MM-dd');
    },
  handleSizeChange: function(val) {
    console.log(`每页 ${val} 条`);
  },
  handleCurrentChange :function(val) {
    this.pageIndex = val;
    this.getTransactionList();
  },
  getTransactionList:function() {
  let param = {pageIndex: this.pageIndex}
  queryTransaction(param).then(res => {
      //this.goPage(this.pageIndex);
      console.log(res);
      this.total = res.resData.total;
      this.pageSize = res.resData.pageSize;
      this.tableData3 = res.resData.list;
    })
  }
},

  //页面首次进入执行的方法
  mounted() {
    this.getTransactionList();
  }
}
</script>
